<template>
 <el-dialog
  title="修改目录"
  :visible="value"
  width="30%"
  @close="close">
  <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
  <el-form-item label="学科" prop="subjectID">
          <el-select
            v-model="ruleForm.subjectID"
            placeholder="请选择"
          >
            <el-option
              v-for="item in simplelist"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            ></el-option>
          </el-select>
        </el-form-item>

    <el-form-item label="目录名称" prop="tagName">
    <el-input v-model="ruleForm.tagName"></el-input>
  </el-form-item>

  <el-form-item>
    <el-button @click="close">取 消</el-button>
    <el-button type="primary" @click="onsubmit">确 定</el-button>
  </el-form-item>
  </el-form>
</el-dialog>
</template>

<script>
import { add, detail, update } from '../../api/hmmm/tags'
import {
  simple
} from '../../api/hmmm/subjects-simple'
export default {
  props: {
    value: {
      type: Boolean,
      required: true
    },
    editId: {
      type: Number,
      required: true
    },
    isEditOrAdd: {
      type: String,
      required: 'add'
    }
  },
  data () {
    return {
      ruleForm: {
        subjectID: '',
        tagName: ''
      },
      rules: {
        subjectID: [
          { required: true, message: '请选择所属学科', trigger: 'change' }
        ],
        tagName: [
          { required: true, message: '请输入目录名称', trigger: 'blur' }
        ]
      },
      simplelist: []
    }
  },
  created () {
    this.getsimplelist()
    this.getdetail()
  },
  methods: {
    // 获取详情
    async getdetail () {
      // console.log(this.isEditOrAdd)
      // console.log(this.editId)
      if (this.isEditOrAdd === 'edit') {
        const res = await detail({ id: this.editId })
        this.ruleForm.subjectID = res.data.subjectID
        this.ruleForm.tagName = res.data.tagName
      }
    },
    // 提交
    onsubmit () {
      this.$refs.ruleForm.validate(async valid => {
        if (valid) {
          if (this.isEditOrAdd === 'edit') {
            await update({ ...this.ruleForm, id: this.editId })
            // console.log(res, '9099090')
            this.$message.success('修改成功')
            this.$emit('addSuccess')
            this.close()
          } else {
            await add(this.ruleForm)
            // console.log(res, '++')
            this.$message.success('添加成功')
            this.$emit('addSuccess')
            this.close()
          }
        }
      })
    },
    close () {
      this.$emit('input', false)
    },
    // 获取学科列表
    async getsimplelist () {
      const res = await simple()
      this.simplelist = res.data
    }
  }
}
</script>

<style scoped lang='scss'>
.el-input,.el-select {
    width: 260px;
}
</style>
